<!DOCTYPE html>
<html lang="zh-cn">
<head>
	<meta charset="UTF-8" />
	<title>泡泡IM</title>
	<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0, user-scalable=no">
	<meta name="apple-mobile-web-app-capable" content="yes">
	<meta name="apple-touch-fullscreen" content="yes">
	<meta http-equiv="Access-Control-Allow-Origin" content="*">
	<meta name="generator" content="generator_to_replace">
	<link rel="shortcut icon" href="/static/favicon.ico" />
	<link rel="stylesheet" href="/static/web/css/web.css?v=1.1.58" />
</head>
<body>
	<div class="pop__body pop__panel">
		<div class="pop__main">
			<!-- 登录页面 -->
			<div class="pop__panel pop__clearfix" id="login" style="display:none" v-show="display">
				<div class="pop__form-cells">
					<h2 class="pop__form-title">{{$lang('欢迎登录')}}<span v-html="im.setting.app_name"></span></h2>
					<form action="post" @keyup.13="login">
						<div class="pop__form-cell">
							<div><label class="pop__form-label">{{$lang('用户名')}}</label></div>
							<div class="pop__flex1">
								<input class="pop__form-input" name="username" v-model="username" type="text" :placeholder="$lang('输入用户名')">
							</div>
						</div>
						<div class="pop__form-cell">
							<div><label class="pop__form-label">{{$lang('密码')}}</label></div>
							<div class="pop__flex1">
								<input class="pop__form-input" name="password" v-model="password" type="password" :placeholder="$lang('输入密码')">
							</div>
						</div>
						<div class="pop__form-cell">
							<div ><label class="pop__form-label">{{$lang('验证码')}}</label></div>
							<div class="pop__flex1">
								<input class="pop__form-input" type="text" v-model="captcha" :placeholder="$lang('输入验证码')">
							</div>
							<div>
								<img class="pop__form-captcha" :src="im.api.loginCaptcha" @click="switchCaptcha" ref="captchaImg">
							</div>
						</div>
						<div class="pop__form-link"><a href="javascript:;" @click="switchToJoin">{{$lang('注册账号')}}</a></div>
						<div class="pop__form-btn"><a class="pop__btn-primary btn__login" @click="login" href="javascript:;">{{$lang('登录')}}</a></div>
						<div class="pop__switch-lang" @click="switchLang">{{$lang('切换语言')}}</div>
					</form>
				</div>
			</div>

			<!-- 注册页面 -->
			<div id="join" style="display:none;" v-show="display">
				<div class="pop__form-cells">
					<h2 class="pop__form-title">{{$lang('欢迎注册')}}<span v-html="im.setting.app_name"></span></h2>
					<form action="post" @keyup.13="join">
						<div class="pop__form-cell">
							<div><label class="pop__form-label">{{$lang('用户名')}}</label></div>
							<div class="pop__flex1">
								<input class="pop__form-input" name="username" v-model="username" type="text" :placeholder="$lang('输入用户名')">
							</div>
						</div>
						<div class="pop__form-cell">
							<div><label class="pop__form-label">{{$lang('密码')}}</label></div>
							<div class="pop__flex1">
								<input class="pop__form-input" name="password" v-model="password" type="password" :placeholder="$lang('输入密码')">
							</div>
						</div>
						<div class="pop__form-cell">
							<div><label class="pop__form-label">{{$lang('昵称')}}</label></div>
							<div class="pop__flex1">
								<input class="pop__form-input" name="nickname" v-model="nickname" type="text" :placeholder="$lang('输入昵称')">
							</div>
						</div>
						<div class="pop__form-cell">
							<div><label class="pop__form-label">{{$lang('个性签名')}}</label></div>
							<div class="pop__flex1">
								<input class="pop__form-input" name="sign" v-model="sign" type="text" :placeholder="$lang('输入个性签名')">
							</div>
						</div>
						<div class="pop__form-cell">
							<div ><label class="pop__form-label">{{$lang('验证码')}}</label></div>
							<div class="pop__flex1">
								<input class="pop__form-input" type="text" v-model="captcha" :placeholder="$lang('输入验证码')">
							</div>
							<div>
								<img class="pop__form-captcha" :src="im.api.joinCaptcha" @click="switchCaptcha" ref="captchaImg">
							</div>
						</div>
						<div class="pop__form-link"><a href="javascript:;" @click="switchToLogin">{{$lang('已有账号，点击这里登录')}}</a></div>
						<div class="pop__form-btn"><a class="pop__btn-primary btn__login" @click="join" href="javascript:;">{{$lang('提交')}}</a></div>
						<div class="pop__switch-lang" @click="switchLang">{{$lang('切换语言')}}</div>
					</form>
				</div>
			</div>

			<div id="home">
			</div>

			<div id="main_page" class="pop__main" style="display: none">
				<!-- 最左边菜单栏 -->
				<div class="pop__left-bar" id="left-bar">
					<div class="pop__avatar">
						<img :src="im.mine.avatar" @click="im.userDetail(im.mine.uid, false, true)">
					</div>
					<div class="pop__layui-icon pop__left-icon" :class="{pop__selected:im.module=='chat'}" @click="im.module='chat'">&#xebac;<template v-if="unreadMessageCount"><em class="pop__badge">{{unreadMessageCount}}</em></template></div>
					<div class="pop__layui-icon pop__left-icon" :class="{pop__selected:im.module=='addressBook'}" @click="switchToAddressBook">&#xeba8;<template v-if="applyCount"><em class="pop__badge">{{applyCount}}</em></template></div>

					<div class="pop__layui-icon pop__left-icon pop__bottom" :class="{pop__selected:subMenuDisplay}" @click.stop="subMenuDisplay=!subMenuDisplay">&#xebb6;</div>
					<div class="pop__sub-menu" v-show="subMenuDisplay">
						<ul>
							<li @click="switchLang">{{$lang('切换语言')}}</li>
							<li @click="logout">{{$lang('退出')}}</li>
						</ul>
					</div>
				</div>


				<!-- 会话选择栏 -->
				<div class="pop__left-main-panel">
					<div id="search">
						<div class="pop__search-bar">
							<input type="text" placeholder="搜索" ref="input" @blur="check" @input="searchLocal" @focus="im.module='search'" v-model="searchText" @keyup.13="search">
						</div>
						<div class="pop__select-area" v-show="im.module=='search'">
							<div class="pop__scroll-wrapper">
								<div class="pop__scroll-content pop__friend-list">
									<template v-for="item in resultItems">
										<div class="pop__row pop__flexbox pop__flex-align-center pop__cell" @click="im.chat(item.type, item.id)">
											<img class="pop__avatar-small" :src="item.avatar"><span class="pop__name" v-html="item.remark || item.name"></span>
										</div>
									</template>
									<li v-show="searchText">
										<div class="pop__row pop__flexbox pop__flex-align-center pop__cell" @click="search">
											<img class="pop__avatar-small" src="/static/web/img/search-text.png"><span class="pop__flex1"><b>搜索</b>：<span class="pop__green">{{searchText}}</span></span>
										</div>
									</li>
								</div>
							</div>
						</div>
					</div>

					<div class="pop__select-area" id="chatting" v-show="im.module=='chat'">
						<div class="pop__scroll-wrapper" @scroll.passive="contextmenuId=0">
							<div class="pop__scroll-content">
								<template v-for="item in chattingItems">
									<div class="pop__chatting_item" @click="im.chat(item.type, item.id)" @contextmenu.prevent="contextmenu(item.type, item.id, $event)" :key="item.type+''+item.id" :class="{'pop__background-selected':item.type==selectedItem.type&&item.id==selectedItem.id, 'pop__selected':item.type==contextmenuType&&item.id==contextmenuId}">
										<div class="pop__ext">
											<div class="pop__time" :value="lastMessage(item).timestamp" v-html="$formatTime(lastMessage(item).timestamp)"></div>
											<div class="pop__badge" v-if="item.unread_count!=0">{{item.unread_count}}</div>
										</div>
										<div class="pop__avatar">
											<img :src="item.avatar">
										</div>
										<div class="pop__info">
											<h3 class="pop__nickname" v-html="item.name"></h3>
											<p class="pop__msg" v-html="lastMessage(item).content"></p>
										</div>
									</div>
								</template>
							</div>
						</div>
						<div class="pop__contextmenu" :style="{top:contextmenuTop+'px', left:contextmenuLeft+'px'}" v-show="contextmenuId">
							<ul>
								<li @click="deleteItem(contextmenuType, contextmenuId)">{{$lang('移除会话')}}</li>
							</ul>
						</div>
					</div>

					<div class="pop__select-area" id="address_list" v-show="im.module=='addressBook'">
						<div class="pop__scroll-wrapper">
							<div class="pop__scroll-content pop__friend-list" v-show="panel=='friend'">
								<div class="pop__row pop__flexbox pop__flex-align-center pop__cell" @click="panel='group'" v-show="im.setting.group_chat=='on' && panel=='friend'">
									<img class="pop__avatar-small" src="/static/web/img/icon__groups.png" /><span class="pop__flex1">{{$lang('群聊')}}</span>
								</div>

								<div class="pop__row pop__flexbox pop__flex-align-center pop__cell" v-show="im.setting.add_friend=='on'" @click="showApplyList">
									<img class="pop__avatar-small" src="/static/web/img/icon__add-friend.png" /><span class="pop__flex1">{{$lang('好友/群申请')}}</span><label><em class="pop__badge" v-if="unreadApplyCount!=0">{{unreadApplyCount}}</em></label>
								</div>

								<template v-for="(items,key) in im.friend">
									<h2 class="pop__friend-list-letter pop__border-top" :class="'pop__firend_list_'+key||'other'">{{key||'#'}}</h2>
									<template v-for="item in items">
										<div class="pop__row pop__flexbox pop__flex-align-center pop__cell" @click="friendDetail(item.uid)" :class="{'pop__background-selected':selectedUid==item.uid&&userDisplay}" @dblclick="im.chat('friend', item.uid)">
											<img class="pop__avatar-small" :src="item.avatar"><span class="pop__name" v-html="item.remark || item.name"></span>
										</div>
									</template>
								</template>
							</div>

							<div class="pop__scroll-content pop__friend-list" v-show="panel=='group'">
								<div class="pop__row pop__flexbox pop__flex-align-center pop__cell" v-show="im.setting.add_friend=='on'" @click="panel='friend'">
									<img class="pop__avatar-small" src="/static/web/img/icon__friend.png" /><span class="pop__flex1">{{$lang('好友')}}</span><label><em class="pop__badge" v-if="unreadApplyCount!=0">{{unreadApplyCount}}</em></label>
								</div>
								<div class="pop__row pop__flexbox pop__flex-align-center pop__cell" v-show="panel=='group' && im.setting.create_group=='on'" @click="createGroup" :class="{'pop__background-selected':selectedGid==-1}">
									<img class="pop__avatar-small" src="/static/web/img/icon__create-group.png" /><span class="pop__flex1">{{$lang('创建群聊')}}</span>
								</div>

								<template v-for="item in im.group">
									<div class="pop__row pop__flexbox pop__flex-align-center pop__cell" @click="groupDetail(item.gid)"  @dblclick="im.chat('group', item.gid)" :class="{'pop__background-selected':selectedGid==item.gid&&groupDisplay}">
										<img class="pop__avatar-small" :src="item.avatar"><span class="pop__flex1" v-html="item.remark || item.name"></span>
									</div>
								</template>
							</div>

							<div class="pop__scroll-content pop__friend-list" v-show="panel=='apply'">
								<div class="pop__row pop__flexbox pop__flex-align-center pop__cell" v-show="im.setting.add_friend=='on'" @click="panel='friend'">
									<img class="pop__avatar-small" src="/static/web/img/icon__friend.png" /><span class="pop__flex1">{{$lang('好友列表')}}</span>
								</div>

								<template  v-for="item in applyList">
									<div class="pop__row pop__flexbox pop__flex-align-center pop__flex-justify-between pop__cell" @click="applyDetail(item.nid, item.type)" :class="{'pop__background-selected':selectedNid==item.nid&&applyDisplay}">
										<div class="pop__flexbox pop__flex-align-center">
											<img class="pop__avatar-small" :src="item.avatar">
											<div>
												<span class="pop__flex1" v-html="item.nickname"></span>
												<div class="pop__friend-list-operation" v-if="item.type=='join_group'">{{$lang('申请加群')}}</div>
											</div>
										</div>
										<span class="pop__friend-list-operation" v-html="operationName(item.operation)"></span>
									</div>
								</template>

							</div>
						</div>
					</div>

				</div>

				<!-- 对话框 -->
				<div class="pop__right-main-panel" id="chat">
					<div class="pop__chat-head" v-show="im.module=='chat'">
						<span class="pop__title" v-html="chattingInfo.name"></span>
						<file-upload
								class="btn btn-primary"
								:multiple="false"
								:drop="true"
								:drop-directory="false"
								v-model="files"
								@input="dragUpload"
								ref="upload">
						</file-upload>
						<div>
							<span class="pop__layui-icon" @click="detail" v-show="id">&#xeb9a;</span>
						</div>
					</div>
					<div class="pop__chat-drag-upload" v-show="$refs.upload && $refs.upload.dropActive && im.module=='chat' && id">
						<div class="pop__chat-drag-upload-tip">{{$lang('发送给')}} <span v-html="chattingInfo.name"></span></div>
					</div>
					<div class="pop__chat-none pop__flex1" v-show="!id && im.module=='chat'">
					</div>
					<div class="pop__chat-body pop__flex1" @scroll.passive="handleScroll" v-show="im.module=='chat'" @contextmenu.prevent.stop>
						<div class="pop__chat-content">
							<ul class="pop__clearfix">
								<li class="pop__chat-msg-notice" v-show="messageLock && !messageEnd"><span><i class="pop__loading"></i>{{$lang('加载中...')}}</span></li>
								<li class="pop__chat-msg-notice" v-show="messageEnd"><span>{{$lang('没有更多数据了')}}</span></li>
								<template v-for="(item, index) in messageList">
									<li v-if="needInsertTime(item.timestamp) || index==0" class="pop__chat-msg-time"><span>{{$date(item.timestamp)}}</span></li>
									<chat-message
											:type="type"
											:from="item.from"
											:name="item.name"
											:content="item.content"
											:avatar="item.avatar"
											:mid="item.mid"
											:sub_type="item.sub_type"
											:timestamp="item.timestamp"
											:im="im"
									>
									</chat-message>
								</template>
							</ul>
						</div>
					</div>
					<div class="pop__chat-footer" v-show="id && im.module=='chat'">
						<div class="pop__chat-toolbar">
							<span class="pop__layui-icon" @click.stop="openEmotion" v-show="im.setting.emoji=='on'">&#xeb97;</span>

							<span class="pop__layui-icon" v-show="im.setting.upload_img=='on'">&#xeb9c;<form><input type="file" accept="image/*" @change="uploadImage" /></form></span>

							<span class="pop__layui-icon" v-show="im.setting.upload_file=='on'">&#xeba7;<form><input type="file" accept="*" @change="uploadFile"/></form></span>

							<span class="pop__layui-icon" @click.stop="beginVoiceReocord" v-show="im.setting.voice=='on'">&#xeb98;</span>

							<div class="pop__emotion-wrapper" style="display: none" v-show="panel=='face'">
								<div class="pop__border">
									<div class="pop__inner">
										<div class="pop__emotion">
											<div class="pop__faces">
												<template  v-for="(items, index) in emojiList()" :key="index">
													<span v-for="(item, index) in items" :key="index" class="pop__emoji" @click="message+=item">
														{{item}}
													</span>
												</template>
											</div>
										</div>
									</div>
								</div>
							</div>


						</div>
						<div class="pop__chat-text-area">
							<textarea v-model="message" @focus="scrollBottom(true)" @keyup.ctrl.13="send" @paste="paste"></textarea>
						</div>
						<div class="pop__chat-send-area">
							<input type="button" class="pop__chat-send-btn" :value="$lang('发送')" @click="send">
						</div>
					</div>

					<!-- 录音提示 -->
					<div class="pop__mask" v-show="voiceRecording"></div>
					<div class="pop__chat-voice-tip" v-show="voiceRecording">
						<div class="pop__line-scale-pulse-out">
							<div></div>
							<div></div>
							<div></div>
							<div></div>
							<div></div>
						</div>
						<div class="pop__operation pop__flexbox">
							<button class="pop__btn-primary" @click="sendVoice">{{$lang('发送')}}</button>
							<button class="pop__btn-default" @click="cancelVoice">{{$lang('取消')}}</button>
						</div>
					</div>

					<div class="pop__user-detail" v-show="userDetail.display" @click.stop :style="{right:groupDetail.display?'260px':0}">
						<img class="pop__avatar" :src="userDetail.avatar">
						<span class="pop__nickname" v-html="userDetail.nickname"></span>
						<ul>
							<li v-show="userDetail.uid != im.mine.uid">{{$lang('备注')}}<span><input-editor
									:url="im.api.friendRemark"
									:index="'remark'"
									:content="userDetail.remark"
									:params="{friend_uid:userDetail.uid}"
									:callback="syncUser(userDetail.uid)"
							></input-editor></span>
							</li>
							<li>{{$lang('用户名')}}　<span v-html="userDetail.username"></span></li>
							<li>{{$lang('签名')}}　<span v-html="userDetail.sign"></span></li>
						</ul>
						<button class="pop__btn-primary" v-show="userDetail.accountState == 'normal' && userDetail.uid && !userDetail.isFriend && userDetail.uid!=im.mine.uid && im.setting.add_friend=='on'" @click="applyFriend(userDetail.uid)">{{$lang('发起好友申请')}}</button>
						<button class="pop__btn-primary" v-show="((userDetail.uid!=id || type!='friend' || im.module!='chat'))&&userDetail.accountState == 'normal'&&userDetail.isFriend" @click="chat('friend', userDetail.uid)">{{$lang('发起聊天')}}</button>
						<button class="pop__btn-warning" v-show="userDetail.accountState == 'normal' && userDetail.isFriend && ((chat.type!='group' && im.module=='chat') || im.module=='addressBook') && !groupDetail.display" @click="deleteFriend(userDetail.uid)">{{$lang('删除好友')}}</button>
					</div>

					<div class="pop__user-detail" v-show="applyDetail.display" @click.stop :style="{right:groupDetail.display?'260px':0}">
						<img class="pop__avatar" :src="applyDetail.avatar">
						<span class="pop__nickname" v-html="applyDetail.nickname"></span>
						<ul>
							<li>{{$lang('用户名')}}　<span v-html="applyDetail.username"></span></li>
							<li>{{$lang('附言')}}　<span v-html="applyDetail.postscript"></span></li>
							<li v-if="applyDetail.type=='join_group'">
								{{$lang('申请加群')}} {{applyDetail.group.groupname}}
							</li>
						</ul>
						<button class="pop__btn-primary" v-if="applyDetail.operation=='not_operated'" @click="applyAgree(applyDetail.nid, applyDetail.type)">{{$lang('同意申请')}}</button>
						<button class="pop__btn-warning" v-if="applyDetail.operation=='not_operated'" @click="applyRefuse(applyDetail.nid, applyDetail.type)">{{$lang('拒绝申请')}}</button>
						<label class="pop__friend-list-operation" v-if="applyDetail.operation!='not_operated'">{{applyDetail.operation=='agree'?$lang('已同意'):$lang('已拒绝')}}</label>
					</div>

					<div class="pop__group-detail" v-show="groupDetail.display" @click.stop="userDetail.display=false">
						<!-- //群详细资料页 -->
						<div class="pop__detail-panel">
							<ul class="pop__clearfix">
								<li>
									<div class="pop__detail-item pop__flexbox pop__flex-wrap pop__flex-align-center pop__cell">
										<template v-for="item in groupDetail.members">
											<div class="pop__avatar" @click.stop="memberDetail(item.uid)"><img
													:src="item.avatar"/><span v-html="item.remark||item.nickname"></span></div>
										</template>
										<div class="pop__avatar" @click="groupAddMember(groupDetail.gid)">
											<div class="pop__operation-adduser pop__operation-icon"></div>
										</div>
										<div class="pop__avatar" @click="groupDelMember(groupDetail.gid)"
											 v-if="groupDetail.is_manager">
											<div class="pop__operation-deluser pop__operation-icon"></div>
										</div>
										<div class="pop__more-item pop__flex1 pop__flexbox pop__flex-align-center pop__flex-justify-center pop__cell">
											<div class="pop__more" @click="groupMembers" :style="{cursor: groupDetail.ended?'default':'pointer'}">
												<span>
													{{!groupDetail.ended?$lang('查看更多群成员'): $lang('没有更多数据了')}}
												</span>
											</div>
										</div>
									</div>

								</li>
								<li>
									<div class="pop__detail-item pop__flexbox pop__flex-align-center pop__cell" :routeUrl="im.baseUri+'group/'+(groupDetail.uid==im.mine.uid ? 'rename' : 'remark')+'/'+groupDetail.gid">
										<span class="pop__detail-item-left">
											{{groupDetail.is_manager ? $lang('群聊名称') : $lang('备注名称')}}
										</span>
										<input-editor
										:url="groupDetail.is_manager ? im.api.groupUpdate : im.api.groupRemark"
										:index="groupDetail.is_manager ?'groupname':'remark'"
										:content="groupDetail.is_manager ? groupDetail.groupname : groupDetail.remark || groupDetail.groupname"
										:params="{gid:groupDetail.gid}"
										:callback="syncGroup(groupDetail.gid)"
										>

										</input-editor>
									</div>
								</li>
								<li v-show="groupDetail.is_manager">
									<div class="pop__detail-item pop__flexbox pop__flex-align-center pop__cell">
										<span class="pop__flex1">{{$lang('全员禁言')}}</span>
										<div class="pop__input-block">
											<input type="checkbox" v-model="groupDetail.forbid_speaking">
											<div class="pop__unselect pop__form-switch" :class="{'pop__form-onswitch':groupDetail.forbid_speaking==1}" @click="toggleForbidSpeaking()">
												<em>{{groupDetail.forbid_speaking==1 ? 'ON' : 'OFF'}}</em><i></i>
											</div>
										</div>
									</div>
								</li>
							</ul>
						</div>
						<div class="pop__btns-panel">
							<button class="pop__btn-primary" v-show="im.module!='chat'" @click="chat('group', groupDetail.gid)">{{$lang('发消息')}}</button>
							<button v-if="groupDetail.uid!=im.mine.uid" class="pop__btn-warning" @click="leaveGroup(groupDetail.gid)">{{$lang('离开群组')}}</button>
							<button v-if="groupDetail.uid==im.mine.uid" class="pop__btn-warning" @click="deleteGroup(groupDetail.gid)">{{$lang('解散群组')}}</button>
						</div>
					</div>

					<div class="pop__contextmenu" ref="menu" v-show="tapMenuShow" @click.stop="closeTapMenu(100)">
						<ul>
							<li v-show="supportUserDetail" @click="im.userDetail($refs.menu.from)" @mouseover="closeSubMemberForbiddenMenu">{{$lang('用户详情')}}</li>
							<li @click="copy" v-show="supportCopy" @mouseover="closeSubMemberForbiddenMenu">{{$lang('复制消息')}}</li>
							<li @click="revoke" v-show="supportRevoke" @mouseover="closeSubMemberForbiddenMenu">{{$lang('撤回消息')}}</li>
							<li @click="doGroupMemberDelete" v-show="supportMemberDelete" @mouseover="closeSubMemberForbiddenMenu">{{$lang('移出群组')}}</li>
							<li v-show="supportForbidden" class="pop__flexbox" @mouseover.stop="showSubMemberForbiddenMenu">{{$lang('禁言')}}<div class="pop__arr"></div></li>
						</ul>
						<ul class="pop__sub-menu" ref="subMemberForbiddenMenu" style="display: none" @mouseover.stop>
							<li @click="doMemberForbidden(-1)">{{$lang('解除禁言')}}</li>
							<li @click="doMemberForbidden(600)">10{{$lang('分钟 ')}}</li>
							<li @click="doMemberForbidden(3600)">1{{$lang('小时')}}</li>
							<li @click="doMemberForbidden(43200)">12{{$lang('小时 ')}}</li>
							<li @click="doMemberForbidden(86400)">1{{$lang('天')}}</li>
							<li @click="doMemberForbidden(259200)">3{{$lang('天 ')}}</li>
							<li @click="doMemberForbidden(604800)">7{{$lang('天 ')}}</li>
							<li @click="doMemberForbidden(1296000)">15{{$lang('天 ')}}</li>
							<li @click="doMemberForbidden(2592000)">30{{$lang('天 ')}}</li>
						</ul>
					</div>

				</div>


				<div id="user_detail" class="pop__user-detail pop__panel pop__user-info" v-show="display" @click.stop>
					<div class="pop__avatar-panel">
						<img class="pop__avatar" :src="im.mine.avatar" v-if="uid == im.mine.uid">
						<form v-if="uid == im.mine.uid"><input class="pop__input-choose-avatar" type="file" accept="image/*" @change="uploadAvatar" /></form>
						<img class="pop__avatar" :src="avatar" v-if="uid != im.mine.uid">
					</div>
					<ul>
						<li>
							{{$lang('昵称')}}　
							<span v-if="uid != im.mine.uid"  v-html="nickname"></span>
							<span v-if="uid == im.mine.uid">
								<input-editor
										:url="im.api.userUpdate"
										:index="'nickname'"
										:content="nickname"
										:params="{}"
										:callback="updateNickname"
								></input-editor>
							</span>
						</li>
						<li>{{$lang('用户名')}}　<span v-html="username"></span></li>
						<li>{{$lang('签名')}}　
							<span v-if="sign" v-show="uid != im.mine.uid"></span>
							<span v-if="uid == im.mine.uid">
								<input-editor
										:url="im.api.userUpdate"
										:index="'sign'"
										:content="sign"
										:params="{}"
										:callback="false"
								></input-editor>
							</span>
						</li>
					</ul>
					<button class="pop__btn-primary" v-show="accountState == 'normal' && uid && !isFriend && uid!=im.mine.uid  && im.setting.add_friend=='on'" @click="applyFriend(uid)">{{$lang('发起好友申请')}}</button>
					<button class="pop__btn-primary" v-show="accountState == 'normal'&& isFriend" @click="im.chat('friend', uid)">{{$lang('发起对话')}}</button>
					<button class="pop__btn-warning" v-show="accountState == 'normal' && isFriend" @click="deleteFriend(uid)">{{$lang('删除好友')}}</button>
				</div>

			</div><!--end main_page -->
		</div>
	</div>

	<div id="setting" style="display: none;" v-show="display" @click.stop>
		<div class="pop__mask"  @click="cancel"></div>
		<div class="pop__setting pop__panel">
			<div class="pop__title" v-html="$lang(title)">

			</div>
			<div>
				<textarea v-model="$lang(content)"></textarea>
				<div class="pop__info" v-html="$lang(desc)"></div>
			</div>
			<div class="pop__operation pop__flexbox">
				<button class="pop__btn-primary" @click="action">{{$lang('发送')}}</button>
				<button class="pop__btn-default" @click="cancel">{{$lang('取消')}}</button>
			</div>
		</div>
	</div>

	<div id="actionsheet" style="display: none;" v-show="display" @click.stop>
		<div class="pop__mask"  @click="cancel"></div>
		<div class="pop__confirm pop__panel">
			<div class="pop__title" v-html="$lang(title)" v-html="title">

			</div>
			<div class="pop__info" v-html="$lang(content)">{{$lang('你需要发送好友请求，对方通过后才能成为好友')}}</div>
			<div class="pop__operation pop__flexbox">
				<button :class="{'pop__btn-warning':warning, 'pop__btn-primary':!warning}"  @click="action">{{$lang('确认')}}</button>
				<button class="pop__btn-default" @click="cancel" v-show="callback">{{$lang('取消')}}</button>
			</div>
		</div>
	</div>

	<div class="pop__panel pop__group-operation" id="group" style="display: none;" v-show="display" @click.stop>
		<div class="pop__list-head">
			<div>{{$lang('选择联系人')}}</div><div class="pop__cross" @click="display=false"></div>
		</div>
		<div class="pop__list-body">
			<div class="pop__scrolling-panel">
				<div class="pop__friend-list">
					<ul class="pop__clearfix pop__cells_checkbox">
						<li>
							<form ref="form">
								<template v-for="(items,key) in members">
									<h2 class="pop__friend-list-letter pop__border-top" :class="'pop__firend_list_'+key||'other'">{{key||'#'}}</h2>
									<template v-for="item in items">
										<label class="pop__row pop__flexbox pop__flex-align-center pop__cell pop__check-label">
											<input type="checkbox" class="pop__check" v-model="selectedItems" :value="item.uid">
											<i class="pop__icon-checked"></i>
											<img class="pop__avatar-small" :src="item.avatar"><span class="pop__name pop__flex1" v-html="item.name||item.remark||item.nickname"></span>
										</label>
									</template>
								</template>
							</form>
						</li>
					</ul>
				</div>
			</div>
		</div>
		<div class="pop__list-bottom">
			<button class="pop__btn-primary":disabled="!selectedItems.length" @click="action">完成{{selectedItems.length ? '('+selectedItems.length+')' : ''}}</button>
		</div>
	</div>


	<div class="pop__panel" id="toast" style="display: none;" v-show="dataPosting">
		<div class="pop__toast">
			<div>
				<div class="pop__icon_toast" :class="{'pop__loadding-ball-beat':dataPosting==1, 'pop__icon-success-no-circle':dataPosting==2}">
					<div></div>
					<div></div>
					<div></div>
				</div>
				<p class="pop__toast__content">{{dataPosting == 2?$lang('操作成功'):''}}</p>
			</div>
		</div>
	</div>

	<div class="pop__panel pop__group-operation" id="language" style="display: none;" v-show="display" @click.stop>
		<div class="pop__list-head">
			<div>{{$lang('选择语言')}}</div><div class="pop__cross" @click="display=false"></div>
		</div>
		<div class="pop__list-body">
			<div class="pop__scrolling-panel">
				<div class="pop__friend-list">
					<ul class="pop__clearfix pop__cells_checkbox">
						<li>
							<form ref="form">
								<label class="pop__row pop__flexbox pop__flex-align-center pop__cell pop__check-label">
									<input type="radio" class="pop__check" v-model="selectedValue" value="zh-CN" :checked="selectedValue=='zh-CN'">
									<i class="pop__icon-checked"></i>
									<span class="pop__name pop__flex1">简体中文</span>
								</label>
								<label class="pop__row pop__flexbox pop__flex-align-center pop__cell pop__check-label">
									<input type="radio" class="pop__check" v-model="selectedValue" value="en" :checked="selectedValue=='en'">
									<i class="pop__icon-checked"></i>
									<span class="pop__name pop__flex1">English</span>
								</label>
							</form>
						</li>
					</ul>
				</div>
			</div>
		</div>
		<div class="pop__list-bottom">
			<button class="pop__btn-primary" @click="action">{{$lang('完成')}}</button>
		</div>
	</div>

	<!-- 图片预览弹窗 -->
	<div class="pop__img-view" style="display: none;">
		<div class="swiper-container pop__img-view-container">
			<div class="swiper-wrapper"></div>
		</div>
	</div>

	<!-- 视频播放 -->
	<div class="pop__video-view" style="display: none;">
		<i class="pop__close-btn"></i>
		<video id="pop__video" width="100%" height="100%" controls="controls" x5-video-player-type="h5" x5-video-player-fullscreen="true" webkit-playsinline preload="auto"></video>
	</div>

    <!-- electron 环境时 窗口最小化 关闭 按钮 -->
	<div class="pop__topbar-box" id="topbar" style="display:none" v-show="show">
		<div class="pop__topbar-item pop__topbar-item-min" @click="toggle('min')">
			<div class="pop__min"></div>
		</div>
		<div class="pop__topbar-item pop__topbar-item-close" @click="toggle('close')">
			<div class="pop__close"></div>
		</div>
	</div>


	<script src="/static/web/js/zepto.min.js"></script>
	<script src="/static/web/js/vue.min.js"></script>
	<script src="/static/web/js/subscriber.js?v=1.2"></script>
	<script src="/static/web/js/vue-upload.min.js"></script>
	<script>
        Vue.component('file-upload', VueUploadComponent)
	</script>
	<script src="/static/web/js/pop_function.js?v=3.3"></script>
	<script src="/static/web/js/web.min.js?v=3.2.66"></script>

    <script>
        $(function () {
            var js = document.createElement("script");
            js.src = "/static/web/js/swiper-3.4.1.min.js";
            var s = document.getElementsByTagName("script")[0];
            s.parentNode.insertBefore(js, s);
        });
        $(function () {
            var style = document.createElement("link");
            style.href = '/static/web/css/swiper-3.4.1.min.css';
            style.rel = 'stylesheet';
            style.type = 'text/css';
            var s = document.getElementsByTagName("link")[0];
            s.parentNode.insertBefore(style, s);
        });
        $(function () {
            var js = document.createElement("script");
            js.src = "/static/web/js/webrtc/recorder.js";
            var s = document.getElementsByTagName("script")[0];
            s.parentNode.insertBefore(js, s);
        });

        var topbar = new Vue({
            el: '#topbar',
            methods: {
                toggle: function (type) {
                    var {ipcRenderer} = require('electron');
                    ipcRenderer.send(type);
                }
            },
            computed: {
                show: function () {
                    return is_desk();
                }
            }
        });

	</script>

</body>
</html>